import { useEffect } from "react";
import "./_box1.css";
import styles from "../global_box.css";
import style from "./box1.css";
import { Card, List, Tabs } from "antd-mobile";
import { Box1 } from "../../components/index_box/chart_box1";
import { BOX1_NAME, BOX1_ITEM } from "../../constants/index";
import { useModel } from 'umi';

const BoxPage1 = () => {
  const { setName } = useModel('global')
  useEffect(() => {
    setName(BOX1_NAME)
  }, [])
  return (
    <div className={styles.bg}>
      <div style={{ height: '55px' }}></div>
      <div className={styles.main}>
        <div className={styles.top_echart + ' ' + style.top_echart}>
          <Box1 hasTitle={false}></Box1>
        </div>
        <div className={styles.bottom_list}>
          <Tabs>
            <Tabs.Tab title={BOX1_ITEM.LIST1.HEADER1} key={1}>
              <List header={BOX1_ITEM.LIST1.HEADER}>
                {[1, 2, 3, 4, 5, 6].map(item => <List.Item key={item}>
                  <Card title={"科室名称"} extra={"分类"}>
                    <div className={style.card_content}>
                      <div>{"状态"}</div><div className={style.createAt}>{"2024-4-22 11:36:00"}</div>
                    </div>
                  </Card>
                </List.Item>)}
              </List>
            </Tabs.Tab>
            <Tabs.Tab title={BOX1_ITEM.LIST2.HEADER1} key={2}>
              <List header={BOX1_ITEM.LIST1.HEADER}>
                {[1, 2, 3, 4, 5, 6].map(item => <List.Item key={item}>
                  <Card title={"人员名称"} extra={"所在科室"}>
                    <div className={style.card_content}>
                      <div>{"状态"}</div><div className={style.createAt}>{"2024-4-22 11:36:00"}</div>
                    </div>
                  </Card>
                </List.Item>)}
              </List>
            </Tabs.Tab>
          </Tabs>
        </div>
      </div>
    </div>
  );
};

export default BoxPage1;
